<!DOCTYPE html>
<html>

<head>

    <title>打卡记录</title>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
    <meta name="format-detection" content="telephone=no" />
    <meta name="format-detection" content="email=no">
    <meta HTTP-EQUIV="Pragma" CONTENT="no-cache">
    <meta HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
    <meta HTTP-EQUIV="Expires" CONTENT="0">
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <link rel="stylesheet" type="text/css" href="css/patientList.css" />
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        h4 {
            padding-top: 0.5rem;
        }
    </style>
</head>

<body>
    <div id="app">
        <el-button @click="back()" style="float: left;">&lt;</el-button>
        <h4>打卡记录</h4>
        <div style="float: right;">
            <el-date-picker v-model="value1" value-format="yyyy-MM-dd 00:00:00" v-on:change="change" type="date"
                placeholder="选择日期">
            </el-date-picker>
        </div>
        <el-table :data="tableData" stripe style="width: 100%">

            <el-table-column prop="breakfastRecord.foodRecordRemark" label="打卡项目">
            </el-table-column>
            <el-table-column prop="recordDate" label="时间">
            </el-table-column>
            <el-table-column prop="breakfastRecord.recordPhoto" label="打卡数据">
                <!-- <span><img src=`${scope.row.breakfastRecord.recordPhoto}` alt=""></span> -->
                <span><img src=http://47.106.78.19:32011/jeecg-boot/pig_1635146150273.jpg alt=""></span>
            </el-table-column>
        </el-table>

    </div>

</body>
<script src="../common/js/api/vue3-axios-utils.js"></script>
<!-- import Vue before Element -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
    new Vue({
        el: '#app',
        data() {
            return {
                input: '',
                value1: '',

                tableData: []

            };
        },
        created() {
            this.GetRequest()
        },
        methods: {
            change() {
                console.log(222);
                console.log(this.tableData.recordDate);
                this.GetRequest();

            },
            back() {
                history.go(-1);
            },
            GetRequest() {
                var token = localStorage.getItem("token");
                var searchURL = window.location.search;
                searchURL = searchURL.substring(1, searchURL.length);
                var targetPageId = searchURL.split("&")[0].split("=")[1];
                console.log(targetPageId);
                console.log(this.value1);
                // axios.post(spliceUrl('/100/12/1001201'), {
                //     headers: {
                //         'X-Access-Token': token,
                //     },
                // }).then(response => {
                //     console.log(response);
                // }).catch(error => {
                //     console.log(error);
                // })
                axios({
                    url: spliceUrl('/record/common/get/list'),
                    // url: spliceUrl('/record/common/get/list'),
                    method: 'get',
                    headers: {
                        'X-Access-Token': token,
                    },
                    params: {
                        patientId: targetPageId,
                        recordDate: this.value1
                    },
                }).then(response => {
                    this.tableData = response.data.result;
                    // console.log(response.data.result.patientId);
                }).catch(error => {
                    console.log(error);
                })
            }
        }

    })
</script>

</html>